<template>
  <div class="errPage-container">
    <!-- <Head :backFlag="backFlag" :v-if="false" :title="title"></Head> -->
    <Button @click="comeBack"
            icon='arrow-left'
            class="pan-back-btn">返回登录</Button>
    <h1 class="text-jumbo text-ginormous">Oops!</h1>
    <h2 class="text-content">{{content}}</h2>
    <!-- <ul class="list-unstyled">
      <li>或者你可以去:</li>
      <li class="link-type">
        <router-link to="/">回登录</router-link>
      </li>
    </ul> -->
    <img :src="errGif"
         width="313"
         height="428"
         alt="Girl has dropped her ice cream.">
  </div>
</template>

<script>
import errGif from '@/assets/img/error/401.gif'
// import { goLogin } from '../../router'

export default {
  name: 'page401',
  data () {
    return {
      title: '',
      errGif: errGif + '?' + +new Date(),
      backFlag: true,
      content: ''
    }
  },
  methods: {
    comeBack () {
      this.$router.push('/app-vue/login')
    }
  },
  mounted () {
    // console.log(this.$route)
    this.content = this.$route.query.msg
  },
  components: {
    // Head: () => import('../../components/app-ui/head')
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.errPage-container {
  text-align: center;
  width: 100%;
  height: 100%;
  .pan-gif {
    margin: 0 auto;
    display: block;
  }
  .pan-img {
    display: block;
    margin: 0 auto;
    width: 100%;
  }
  .text-jumbo {
    margin-top: 15%;
    font-size: 30px;
    font-weight: 700;
    color: #484848;
  }
  .text-content {
    padding: 0 20px;
  }
  .list-unstyled {
    font-size: 14px;
    li {
      padding-bottom: 5px;
    }
  }
}
</style>
